import { Navigate, useRoutes } from 'react-router-dom'

import Home from '../views/Home'
import Error from '../views/Error'
import Movie from '../views/Movie'
import MovieIng from '../views/Movie/Ing'
import MovieHot from '../views/Movie/Hot'
import MovieDetail from '../views/Movie/Detail'

import City from '../views/City'

const RouterView = () => {
    const routes = useRoutes([
        {
            path: '/',
            element: <Home />,
            Children: [
                {
                    path: '/home',
                    element: <Navigate to="/home" />
                }
            ]
        }, {
            path: '/movie',
            element: <Movie />,
            children: [
                {
                    path: '/movie',
                    element: <Navigate to="/movie/hot" />
                }, {
                    path: 'ing',
                    element: <MovieIng />
                }, {
                    path: 'hot',
                    element: <MovieHot />
                },
            ]
        }, {
            path: '/movie/detail',
            element: <MovieDetail />
        }, {
            path: '/city',
            element: <City />
        }, {
            path: '*',
            element: <Error />
        }
    ])
    return routes
}

export default RouterView
